<template>
  <transition name="slide">
    <div class="list">
      <van-nav-bar title="校车时刻" leftText="返回" rightText="1" leftArrow @click-left="onClickLeft" @click-right="onClickRight" />
      <!-- <div class="scroll-wrapper" :ref="scroll-wrapper">
        <cube-scroll ref="scroll" :data="items" :options="options" @pulling-up="onPullingUp" @pulling-down="onPullingDown"></cube-scroll>
      </div> -->
      
      <div id="carListDetail">
        
      </div>
      <router-view></router-view>
    </div>
  </transition>
</template>
<script>
import store from "../../common/store";
import Vue from 'vue';
import { Search } from 'vant';

Vue.use(Search);

export default {
  data (){
    return {
      value:'',
      toggle:true,
      carList:'',
    }
  },
  methods:{
    onClickLeft () {
      this.$router.go(-1)
      this.$router.beforeEach((to, from, next) => {
        const toDepth = to.path.split('/').length
        const fromDepth = from.path.split('/').length
        if (toDepth < fromDepth) {
          console.log('后退。。。')
          from.meta.keepAlive = false
          to.meta.keepAlive = true
        }
        next()
      })
    },
    onClickRight () {
      this.$router.push('/list/mint-pull')
    },
    onSearch (){},
    onCancel (){},
    
  },
  
  created () {
    this.carList = store.state.carList;
    setTimeout(() => {
      let doc = document.getElementById('carListDetail')
      console.log(doc)
      doc.innerHTML =  this.carList
    }, 300);
    
  }
}
</script>
<style lang="less" scoped>
@import  "../../assets/less/baseDetail.less";


#carListDetail{
  width: 100%;
  height: calc(~'100% - 46px');
  overflow: scroll;
  img {
    width: 100%;
  }
  p,li{
    line-height: 30px;
    text-indent: 2em;
    font-size: 13px;
  }
}

</style>

